<%@ page contentType="text/html;charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="tags" tagdir="/WEB-INF/tags"%>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<html>
<head>
<title>流程表单模板管理</title>
<script type="text/javascript">
	var $grid;
	$(function() {
		$('#typeId').combotree({
			url : '${ctx}/pub/combotree/bpmFormTemplateType',
			method : 'get',
			editable : false,
			idField : 'id',
			textField : 'text',
			parentField : 'pid',
			dataPlain : true
		});
		$grid = $("#grid").datagrid($.extend(datagridOption, {
			url : "${ctx}/bpm/formTemplate/dataGrid",
			columns : [ [ {
				field : 'ck',
				checkbox : true
			}, {
				field : 'name',
				title : '模板名称',
				sortable : true
			}, {
				field : 'type',
				title : '模板类型',
				sortable : true,
				formatter : function(value, row, index) {
					row['typeId'] = value ? value.id : "";//设置流程类型ID
					return value ? value.codeName : "";
				}
			}, {
				field : 'content',
				title : '模板内容',
				width : 460,
				styler : function() {
					return "nowrap:false";
				}
			} ] ]
		}));
		$grid.datagrid('enableFilter', [ {
			field : 'type',
			searchField : 'type.codeName'
		} ]);

		$("#add").click(function() {
			$("#fm").form("clear");
			$("#dlg").dialog("open").dialog("setTitle", "新增");
		});
		$("#edit").click(function() {
			var rowData = $grid.datagrid("getSelected");
			if (rowData == null) {
				$.messager.show({
					msg : "您未选中行，无法编辑",
					icon : "warning",
					position : "bottomRight"
				});
			} else {
				$("#dlg").dialog("open").dialog("setTitle", "编辑");
				$("#fm").form("load", rowData);
			}
		});
		$("#design").click(function() {
			var rowData = $grid.datagrid("getSelected");
			if (rowData == null) {
				$.messager.show({
					msg : "您未选中行，无法操作",
					icon : "warning",
					position : "bottomRight"
				});
			} else {
				window.parent.addTab("formDesign", "[" + rowData.name + "]表单设计", "${ctx}/bpm/formTemplate/update/" + rowData.id);
				//formDesigner("${ctx}/bpm/formTemplate/update/" + rowData.id);
			}
		});
		$("#delete").click(function() {
			var rowData = $grid.datagrid("getSelected");
			if (rowData == null) {
				$.messager.show({
					msg : "您未选中行，无法删除",
					icon : "warning",
					position : "bottomRight"
				});
			} else {
				$.messager.confirm("您确定要进行该操作？", function(c) {
					if (c) {
						$.get("${ctx}/bpm/formTemplate/delete/" + rowData.id, function(result) {
							$.messager.show({
								msg : result.msg,
								icon : "info",
								position : "bottomRight"
							});
							if (result.success) {
								$grid.datagrid("deleteRow", rowData);
							}
						}, 'json');
					}
				});
			}
		});
	});
	function fn_save() {
		$("#fm").form("submit", {
			url : "${ctx}/bpm/formTemplate/update",
			success : function(data) {
				$grid.datagrid("load");
				$.messager.show({
					msg : data.msg,
					icon : "info",
					position : "bottomRight"
				});
				$("#dlg").dialog('close');
			}
		});
	}
	function formDesigner(href) {
		$("#win").window({
			title : "表单设计",
			width : 800,
			height : 400,
			href : href,
			iniframe : true,
			autoVCenter : true,
			autoHCenter : true,
			maximized : true
		});
	}
</script>
</head>

<body>
	<div data-options="region:'center',fit:true,border:false">
		<table id="grid">
		</table>
	</div>
	<div id="tt" class="row">
		<div class="col-md-12">
			<shiro:hasPermission name="bpmFormTemplate:update">
				<button id="add" type="button" class="btn btn-primary">
					<span class="glyphicon glyphicon-plus"></span> 新增
				</button>
				<button id="edit" type="button" class="btn btn-primary">
					<span class="glyphicon glyphicon-pencil"></span> 编辑
				</button>
			</shiro:hasPermission>
			<shiro:hasPermission name="bpmFormTemplate:delete">
				<button id="delete" type="button" class="btn btn-danger">
					<span class="glyphicon glyphicon-minus"></span> 删除
				</button>
			</shiro:hasPermission>
			<div class="dialog-tool-separator"></div>
			<shiro:hasPermission name="bpmFormTemplate:design">
				<button id="design" type="button" class="btn btn-danger">
					<span class="glyphicon glyphicon-leaf"></span> 设计
				</button>
			</shiro:hasPermission>
		</div>
	</div>
	<div id="win"></div>
	<shiro:hasPermission name="bpmFormTemplate:update">
		<div id="dlg" class="easyui-dialog" style="width: 380px; height: 280px; padding: 10px 20px"
			data-options="iconCls:'icon-save',resizable:true,modal:true, buttons:[
                    { text: '保存', iconCls: 'icon-ok', handler: function () { fn_save(); } },
                    { text: '取消', iconCls:'icon-cancel', handler: function () { $('#dlg').dialog('close'); } }
                ],closed:true">
			<form id="fm" method="post">
				<input type="hidden" name="id" />

				<table id="tbl">
					<tr>
						<td><label>表单模板名称:</label></td>
						<td><input name="name" class="easyui-validatebox" data-options="required:true"></td>
					</tr>
					<tr>
						<td><label>表单模板类型:</label></td>
						<td><input id="typeId" name="typeId" data-options="required:true,width:185"></td>
					</tr>
					<tr>
						<td><label>模板内容:</label></td>
						<td><input name="content" class="easyui-textbox" data-options="multiline:true,width:185,height:60"></td>
					</tr>
				</table>

			</form>
		</div>
	</shiro:hasPermission>
</body>
</html>
